import {Component, ViewChild} from '@angular/core';
import {BreakpointObserver, Breakpoints, BreakpointState,} from '@angular/cdk/layout';
import {Observable} from 'rxjs';
import {map} from 'rxjs/operators';
import {Router} from '@angular/router';
/** @title Responsive sidenav */
@Component({
  selector: 'app-side-nav',
  templateUrl: 'side-nav.component.html',
  styleUrls: ['side-nav.component.scss'],
})
export class SideNavComponent {
  @ViewChild('drawer', {static: false}) drawer: any;
  public drawerOpened: boolean;
  public selectedItem = '';
  public isNotHome: boolean = this.currentRoute.url !== '/';
  public password: string;
  public isHandset$: Observable<boolean> = this.breakpointObserver
    .observe(Breakpoints.Handset)
    .pipe(map((result: BreakpointState) => result.matches));


  constructor(
    private breakpointObserver: BreakpointObserver,
    private currentRoute: Router
    ) {}


  closeSideNav() {
    this.drawer.close();
    console.log(this.drawer);
    if (this.drawer._mode === 'over') {
      this.drawer.close();
    }

  }
}
